import { createApp } from 'vue';
import App from './App.vue';
//引入模板的初始化样式
import '@/assets/less/index.less';
//引入element-plus插件与样式
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
//引入路由
import router from './router';
//引入自定义插件对象:注册整个项目全局组件
import globalComponent from '@/components';
//引入大仓库
import { createPinia } from 'pinia';
//引入本地mock
import "@/api/mock.js";
//引入api（里面是所有请求接口）
import api from './api/api';
//引入小仓库
import { useAllDataStore } from './store';

function isRoute(to) {
    //传递过来的to是路由，看该路由有没有包含在我们的系列路由中
    let res = router.getRoutes();
    let resFil = res.filter(item => item.path === to.path);
    return resFil.length > 0;
}
//路由守卫
router.beforeEach((to, from) => {
    //若当前路由为非登录页且没有token，应跳到登录页进行登录
    if (to.path !== '/login' && !store.state.token) {
        return { name: "login" }
    }
    //若当前路由不属于我们的系列路由，则要跳转至404页面
    if (!isRoute(to)) {
        return { name: "404" }
    }
})
const pinia = createPinia();
const app = createApp(App);
//挂载仓库
app.use(pinia);
const store = useAllDataStore();//store得在pinia挂载之后才能使用
//全局挂载api
app.config.globalProperties.$api = api;
app.use(ElementPlus);
//安装自定义插件
app.use(globalComponent);
//实现动态路由（这句一定要放在挂载路由之前）
store.addMenu(router, "refresh");//refresh是类别
//挂载路由
app.use(router);
app.mount('#app');
